<template>
	<view>
		<view class="change-nickname">
			<view class="nickname">
				昵称
			</view>
			<uni-easyinput class='input-box'  v-model="nickname" placeholder="请输入昵称" />
		</view>
		<button @tap='confirmChange' class="confirm" type="default">确认</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nickname: ''
			};
		},
		methods: {
			async confirmChange() {
				if (!this.nickname) {
					uni.$toast('昵称不能为空')
					return
				}
				const res = await this.$http.request('/api/v1/member/save', {nickname: this.nickname})
				if (res.code == 200) {
					uni.$toast('修改成功', true)
					this.nickname = ''
					return
				}
				uni.$toast('修改失败')
			}
		}
	}
</script>

<style lang="scss" scoped>
.change-nickname {
	margin-top: 60rpx;
	padding: 0 32rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	.nickname {
		margin-right: 20rpx;
	}
	.input-box {
		width: 500rpx;
	}
}
.confirm {
	margin-top: 140rpx;
	width: 300rpx;
	
}
</style>
